import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import './index.less';
import Banner from 'COMPONENT/Banner';
import FootTabBar from 'COMPONENT/FootTabBar';
import CommonHeader from 'COMPONENT/CommonHeader';

import { Carousel, WingBlank, SearchBar, Grid } from 'antd-mobile';
		
import {
  Icon,
  TabBar,
  Modal,
  Toast
} from 'antd-mobile'
import {Link} from 'react-router'

import client from 'UTIL/native'
import {getUrlParams, canvasDataURL, getLocalData, md5Enc,clearImg} from 'UTIL/commonUtil';
import { imgUrl, devUrl} from 'SERVICE/xhr/config';

const rentImgData = ['ershoufang','haiwai','lvju','maifang','xiaoqu','xinfang','zhuangxiu','zufang','ershoufang','haiwai','lvju','moreCate'];
//const alert = Modal.alert;
const gridTitleData = ['买房','卖房','租房','修房','住房'];

/*const data11 = ['保证金圈存','首付款划扣','保证金查询','个人住房贷款'];
const data22 = ['我的房贷','房贷申请','征信授权','房查授权','进度查询','资金托管'];
const data33 = ['维修资金缴交','维修资金使用','维修资金查询'];
const data44 = ['门禁通行','代收包裹','物业缴费','维修上报','生活缴费','意见建议','社区公告', '社区金融'];
const data55 = ['我要租房','租约查询','公积金租房提取'];
const data66 = ['房抵贷','信用贷','我的贷款','贷款工具'];*/



//新房
const newHouse = [
	{'title':'保证金圈存','img':'ershoufang','path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/deposit','jumpType':'1','menuCode':''},
	{'title':'首付款划扣','img':'haiwai','path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/signPersonAgreement','jumpType':'1','menuCode':''},
	{'title':'保证金查询','img':'lvju','path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/depositQuery','jumpType':'1','menuCode':''},
	{'title':'个人住房贷款','img':'maifang','path':'','jumpType':'0','menuCode':''}
]

//二手房  安心换
const resoldApartment  = [
	
	{title:'房贷',img:'xinfang',path:'/Mine/HouseLoanApply',jumpType:'0',menuCode:''},
	{title:'个人征信',img:'zhuangxiu',jumpType:'0',menuCode:'0003',path:'/Mine/Credit'},
	{title:'个人房查',img:'zufang',path:'/Mine/Credit',jumpType:'0',menuCode:'0004'},
	{title:'房贷进度',img:'ershoufang',path:'/Mine/ProgressInquiryList',jumpType:'0',menuCode:''},
	{title:'房贷预算',img:'lvju',path:'',jumpType:'0',menuCode:''},
	{'title':'我的房贷',img:'xiaoqu',path:'',jumpType:'0',menuCode:''},
	
]

//维修资金  安心修
const repair  = [
	{title:'维修资金缴交',img:'xiaoqu',
		path:'http://wepay.test.bankcomm.com/services/houseapp/maintenace-fund/#/writeSearch',
		jumpType:'1',menuCode:''},
	{title:'维修资金使用',img:'xinfang',
		path:'http://wepay.test.bankcomm.com/services/houseapp/maintenace-fund/#/applyUse',
		jumpType:'1',menuCode:''},
	{title:'维修资金查询',img:'zhuangxiu',jumpType:'1',menuCode:'',
	'path':'http://wepay.test.bankcomm.com/services/houseapp/maintenace-fund/#/avaAmt'}
	
]

//社区
const community  = [
	{'title':'门禁通行','img':'xiaoqu','path':'','jumpType':'0','menuCode':''},
	{'title':'代收包裹','img':'xinfang','path':'',jumpType:'0','menuCode':''},
	{'title':'物业缴费','img':'zhuangxiu','jumpType':'1','menuCode':'',
	'path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/propertyPayment'},
	{'title':'维修上报','img':'zufang','jumpType':'1','menuCode':'',
	'path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/repareApply'},
	{'title':'生活缴费','img':'ershoufang','jumpType':'0','menuCode':'','path':''},
	{'title':'意见建议','img':'lvju','jumpType':'1','menuCode':'',
	'path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/suggestion'},
	{'title':'社区公告','img':'zhuangxiu','jumpType':'1','menuCode':'',
	'path':'http://wepay.test.bankcomm.com/services/houseapp/live/#/queryCommBulletin'},
	{'title':'社区金融','img':'zhuangxiu','jumpType':'0','menuCode':'','path':''}
	
]


//租房  安心租
const rent  = [
	{'title':'我要租房','img':'xiaoqu','path':'/RentHouse','jumpType':'0','menuCode':''},
	{'title':'租约查询','img':'xinfang','path':'/RentQuery',jumpType:'0','menuCode':''},
	{'title':'租金缴纳','img':'zufang','jumpType':'0','menuCode':'1000','path':'/RentQuery'},
	
	{'title':'公积金租房提取','img':'zhuangxiu','jumpType':'0','menuCode':'','path':''}
	
]

//安心贷
const loans  = [
	{'title':'房抵贷','img':'xiaoqu','path':'/houseLoan','jumpType':'0','menuCode':''},
	{'title':'信用贷','img':'xinfang','path':'/HmdMain',jumpType:'0','menuCode':''},
	{'title':'我的贷款','img':'zhuangxiu','jumpType':'0','menuCode':'','path':'/MineLoan'},
	{'title':'贷款工具','img':'zufang','jumpType':'0','menuCode':'','path':''}
	
]





let data1 = Array.from(new Array(newHouse.length)).map((_val, i) => ({
  icon:'./imgs/'+newHouse[i]['img']+'.png',
  text: newHouse[i]['title'],
  path: newHouse[i]['path'],
  jumpType:newHouse[i]['jumpType'],
  menuCode:newHouse[i]['menuCode']
  
}));

let data2 = Array.from(new Array(resoldApartment.length)).map((_val, i) => ({
  icon:'./imgs/'+resoldApartment[i]['img']+'.png',
  text: resoldApartment[i]['title'],
  path: resoldApartment[i]['path'],
  jumpType:resoldApartment[i]['jumpType'],
  menuCode:resoldApartment[i]['menuCode']
  
}));

let data3 = Array.from(new Array(repair.length)).map((_val, i) => ({
  icon:'./imgs/'+repair[i]['img']+'.png',
  text: repair[i]['title'],
  path: repair[i]['path'],
  jumpType:repair[i]['jumpType'],
  menuCode:repair[i]['menuCode']
  
}));

let data4 = Array.from(new Array(community.length)).map((_val, i) => ({

  icon:'./imgs/'+community[i]['img']+'.png',
  text: community[i]['title'],
  path: community[i]['path'],
  jumpType:community[i]['jumpType'],
  menuCode:community[i]['menuCode']
  
}));

let data5 = Array.from(new Array(rent.length)).map((_val, i) => ({

  icon:'./imgs/'+rent[i]['img']+'.png',
  text: rent[i]['title'],
  path: rent[i]['path'],
  jumpType:rent[i]['jumpType'],
  menuCode:rent[i]['menuCode']
  
}));

let data6 = Array.from(new Array(loans.length)).map((_val, i) => ({

  icon:'./imgs/'+loans[i]['img']+'.png',
  text: loans[i]['title'],
  path: loans[i]['path'],
  jumpType:loans[i]['jumpType'],
  menuCode:loans[i]['menuCode']

  
}));




export default class Home extends React.Component {
	static contextTypes = {
	    router: PropTypes.object.isRequired
  	}
	
	createGridData () {
		
	}
  	constructor(props) {
	    super(props);
			
			//判断有无登录
			let isLogIn = localStorage.getItem('isLogIn');
			if(!isLogIn){
				localStorage.setItem('isLogIn',"false");
			}
			
			
	    this.state = {
	
	      data: ['1', '2', '3'],
	    }
	    client();
  	}



  
  componentWillMount() {



    //
   
  }

	componentDidMount () {
		setTimeout(() => {
      this.setState({
        data: ['AiyWuByWklrrUDlFignR', 'TekJlZRVCjLFexlOCuWn', 'IJOtIlfsYdTyaDTRVrLI'],
      });
    }, 100);
	}
	

	getMore = (event,el) =>{
		let text = event['text'];
		let type = event['jumpType'];
		let path = event['path'];
		let menuCode = event['menuCode'];
		if(type=='1'){
			if(path){
				native.call({
				   	'fun':'newPage',
				   	'param':{
				   		'url':path,
				   		'title': text,
				   		'menuCode':'menuCode'
				   	}

				})
			}else{
				return false;
			}
			
		}else if(type=='0'){
			if(path){
				if(menuCode){
					if(menuCode == '0004'){
						this.context.router.push({
					    	pathname: path,
					    	query:{
					    		ctype:'credit'
					    	}
					    })
					}if(menuCode == '1000'){
						//判断是否登陆 未登录跳转游客查询页面
						//判断方法
						this.context.router.push({
					    	pathname: '/RentQuery/TouristPage',
					    })
					}else{
						this.context.router.push({
					    	pathname: path
					    })
					}
					
				}else{
					this.context.router.push({
				    	pathname: path
				    })
				}
				
			}else{
				return false;
			}
			
		

		}
		
	}
	
	
	
  //原生调用切换底部图片
  changeFoot=()=>{
    this.setState({url: 'go-1.png'})
  }


 backs = () => {
 	this.context.router.push({
            pathname: '/Home'
        })
 	return false;
 }


  render() {
  	let _this = this;
    return (
      <div>
      	<div className='header' onClick={this.backs} style={{background:'#fff'}}>
 		    <img  onClick={this.backs} src="./imgs/iconfont-6.png" style={{
	    	    height: '.4rem',
			    marginTop: '.25rem',
			    marginLeft: '.2rem'

 		    }} />
      	
 		    <span onClick={this.backs} style={{color:'transparent',
 		        color: 'transparent',
			    height: '.9rem',
			    display: 'inline-block',
			    marginTop: '-0.3rem'}}>返回</span>
 		    <div className = "loginStateHeader" onClick={this.backs}>

 		    
 		    </div>
			<div className="header_title">

				<img  style={{height:'.9rem'}} src="./imgs/input.png" />

			</div>

		</div>
      	
      	<div style={{height:'.9rem'}}></div>
      	<section>
			<div className="cateCards">新房</div>
	        <Grid data={data1} hasLine={false} onClick={(el,index) =>{_this.getMore(el,index)}} />
		</section>
		
		<div style={{background:'#dddbea',height:'.15rem'}}></div>
		<section>
			<div className="cateCards">二手房</div>
	        <Grid data={data2} hasLine={false} onClick={(el,index) =>{_this.getMore(el,index)}} />
		</section>
		<div style={{background:'#dddbea',height:'.15rem'}}></div>
		
		<section>
			<div className="cateCards">维修资金</div>
	        <Grid data={data3} hasLine={false} 
	        	onClick={(el,index) =>{_this.getMore(el,index)}} 
	        />
		</section>
		<div style={{background:'#dddbea',height:'.15rem'}}></div>
		
		<section>
			<div className="cateCards">社区</div>
	        <Grid data={data4} hasLine={false} onClick={(el,index) =>{_this.getMore(el,index)}} />
		</section>
		<div style={{background:'#dddbea',height:'.15rem'}}></div>
		
		<section>
			<div className="cateCards">租房</div>
	        <Grid data={data5} hasLine={false} onClick={(el,index) =>{_this.getMore(el,index)}} />
		</section>
		<div style={{background:'#dddbea',height:'.15rem'}}></div>
		
		<section>
			<div className="cateCards">安心贷</div>
	        <Grid data={data6} hasLine={false} 
	        onClick={(el,index) =>{_this.getMore(el,index)}} />
		</section>
     	
      </div>
    );
  }
}
